<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>平台数据--未来财经旗下p2p网贷门户</title>
<meta name="keywords" content="网贷,P2P网贷,P2P理财,未来网贷">
<meta name="description" content="未来网贷未来财经旗下的P2P网贷理财行业门户网站，提供全方位、权威的网贷平台数据，是您身边的网贷资讯和P2P理财方面的专家,为您的网贷之路保驾护航">
<jsp:include page="/include/header.jsp"/>
<link rel="stylesheet" type="text/css" href="${basePath }/css/shuju.css"/>
<link rel="stylesheet" type="text/css" href="${basePath }/css/jquery-ui.css">
<link rel="stylesheet" type="text/css" href="${basePath }/css/jquery-ui-1.9.2.custom.min17.css">
<link rel="stylesheet" href="${basePath }/css/datepicker.css" />
<script type="text/javascript" src="${basePath }/js/jquery-ym-datePlugin-0.1.js"></script>
<script type="text/javascript" src="${basePath }/js/date.js"></script>
<script type="text/javascript" src="${basePath }/js/datepicker.js"></script>
<script type="text/javascript" src="${basePath }/js/jquery.cookies.2.2.0.js"></script>
<style type="text/css">
	.mytest{
		margin-top: 6px;
	  	line-height: 16px !important;
	}
	.fr{
		float:right !important;
	}
	.bt_99{
		width: 99px;
	}
	a.none-a:hover {
		color:#333;
		text-decoration: none;
		cursor:text;
	}
</style>
<script type="text/javascript">

	$(function() {
		var zhibiaos = $(".zhibiao").find("input[type='checkbox']");
		zhibiaos.click(function() {
			 if($(this).parent().hasClass('checkboxed')==false){    
				   
				   $(this).attr('checked','checked');
				   $(this).parent().addClass('checkboxed');
			 }else{	     
				     $(this).removeAttr('checked');
				     $(this).parent().removeClass('checkboxed');
			}
			
			var checks = $(".zhibiao").find("input[type='checkbox']:checked");
			var len = checks.size();
			if(len<7) {
				zhibiaos.removeAttr("disabled");
				$(".li-tishi").find("i").text(7-len);
			} else {
				$(".li-tishi").find("i").text(0);
				$.each(zhibiaos, function(i, n) {
					var flag = n.checked;
					if(!flag)
						$(n).attr("disabled", "disabled");
				})
			}
			if(len==1) 
				checks.get(0).disabled = 'disabled';
		})
		
		//排序触发
		var links = $("#formDl").find("dt").find("span").find("a");
		links.click(function() {
			var oldStyle = $(this).attr("class");
			var newStyle = '';
			var orderby = '';
			if(oldStyle==null||oldStyle=='visited-2') {
				newStyle = "visited-1";
				orderby = 'desc';
			} else if(oldStyle=='visited-1') {
				newStyle = "visited-2";
				orderby = 'asc';
			}
			links.removeAttr("class");
			$(this).addClass(newStyle);
			var column = $(this).attr("text");
			
			var paramJson = {};
			paramJson.orderby = orderby;
			paramJson.column = column;
			
			var time = getTimeCondition();
			if(time!=null&&time.key=='type') 
				paramJson.timeType = time.value;
			else if(time!=null&&time.key=='str')
				paramJson.timeStr = time.value;
			if(!paramJson.timeStr){
				var txt = $("#widgetField").find("span").text();
				paramJson.timeStr = txt;
			}
			paramJson.provinceId = getProvinceCondition();
			// 加载数据			
			loadData(paramJson);
			//$("#tableDiv").load("${basePath}/data/platformTable", paramJson, selectType);
		})
		
		//时间条件触发
		var links2 = $(".jiansuotiaojian-left").find("a");
		links2.click(function() {
			  $("#zhankai").show();
			  $("#shouqi").show();   
			var date = new Date(); 
			date.addDays(-1);  
			var dateStr = date.toDateString("yyyy-MM-dd");
			var style = $(this).attr("class");
			if(style=='current') return;
			links2.removeAttr("class");
			$(this).addClass("current");
			$("#demoText").val("自定义日期");
			$("#widgetField").find("span").text(dateStr+"/"+dateStr);
			var paramJson = {};
			paramJson.timeType = $(this).attr("text");
			if(paramJson.timeType=='2'){//最近7日
				var dateNow = new Date(); 
				dateNow.addDays(-7);  
				dateNowStr = dateNow.toDateString("yyyy-MM-dd");
				$("#widgetField").find("span").text(dateNowStr+"/"+dateStr);
			}else if(paramJson.timeType=='3'){//最近30日
				var dateNow = new Date(); 
				dateNow.addDays(-30);  
				dateNowStr = dateNow.toDateString("yyyy-MM-dd");
				$("#widgetField").find("span").text(dateNowStr+"/"+dateStr);
			}
			var orderByCondition = getOrderByCondition();
			var orderby = orderByCondition.orderby;
			var column = orderByCondition.column;
			paramJson.orderby = orderby;
			paramJson.column = column;
			
			paramJson.provinceId = getProvinceCondition();
			
			// 加载数据			
			loadData(paramJson);
			//$("#tableDiv").load("${basePath}/data/platformTable", paramJson, selectType);
		})
		
		//省份条件触发
		var links3 = $(".city").find("a");
		links3.click(function() {
			//background-color:#5aa6ff; color:#fff;	color:#444;
			$(".city").find("a").css('color', '').css('background-color', '');
			$(this).css('color', '#fff').css('background-color', '#5aa6ff');
			
			var paramJson = {};
			var provinceId = $(this).attr("text");
			$("#sec-city").attr("text", provinceId);
			paramJson.provinceId = provinceId;
			
			var orderByCondition = getOrderByCondition();
			var orderby = orderByCondition.orderby;
			var column = orderByCondition.column;
			paramJson.orderby = orderby;
			paramJson.column = column;
			
			var time = getTimeCondition();
			if(time!=null&&time.key=='type') 
				paramJson.timeType = time.value;
			else if(time!=null&&time.key=='str')
				paramJson.timeStr = time.value;
			if(!paramJson.timeStr){
				var txt = $("#widgetField").find("span").text();
				paramJson.timeStr = txt;
			}
			// 加载数据			
			loadData(paramJson);
			//$("#tableDiv").load("${basePath}/data/platformTable", paramJson, selectType);
		})
		
		
		// 关注弹出
		$('#guanzhutanchu').click(function(){
			$('#guanzhutanchu').hide();
		});
		
	})
	
	function selectType() {
		var checks = $(".zhibiao").find("input[type='checkbox']:checked");
		$("#formDl").find("dt>span:gt(1)").hide();
		$("#formDl").find("dd").find("span:gt(1)").hide();
		$.each(checks, function(i,n){
			$("#formDl").find("dt>span:eq("+$(n).val()+")").show();
			$("#formDl").find("dd").find("span:eq("+$(n).val()+")").show();
		})
		$("#formDl").find("dt>span").last().show();
		$("#formDl").find("dd").find("span:last").show();
	}
	// 关注
	function addAttention(pid,name) {
		// 加入cookie
		var n = name;
		var arrayObj = new Array();
		var co = 'pid='+pid+'name='+n+';';
		arrayObj.push(co);
		var the = $.cookie('the_cookie');
		if(!the){//第一次
			the='';
		}
		if(the.indexOf(pid)!=-1){//存在
			alert("已经存在");
		}else{
			$.cookie('the_cookie', the+arrayObj,{path:"/"});
		}
		
		alert($.cookie("the_cookie"));
		var a = $.cookie("the_cookie").split(";");
		//alert(a[0].name); 
		
		
		/*
		if(popLogin(null)){
			var n = name;
			$.ajax({
				url:"${basePath}/data/addAttention?pid="+pid,
				dataType:"json",
				async:false,
				success:function(data){
					if(data.msg=='ok'){
						if($(this).hasClass('click')==false){
							$(this).addClass('click');	
							$(this).attr('title','取消关注');
							$('.guanzhu-tishi').css('background-image','url(${basePath}/images/right_icon.png)');
							$('.guanzhu-tishi h2').html('已关注'+n);
							$('#guanzhutanchu').show().delay(3000).hide(0);	
							}
					}
				}
				
			});
		}*/
		}
	
	function getOrderByCondition() {
		var link = $("#formDl").find("dt").find("span").find("a[class^='visited']");
		var orderbyStyle = link.attr("class");
		var orderby = "";
		if(orderbyStyle=='visited-1') 
			orderby = "desc";
		else if(orderbyStyle=='visited-2')
			orderby = "asc";
		var column = link.attr("text");
		return {orderby:orderby, column:column};
	}
	
	function getTimeCondition() {
		var type = $(".jiansuotiaojian-left").find("a[class='current']").attr("text");
		var str = $("#demoText").val();
		if(type!=null)
			return {key:"type", value:type};
		else if(str!=null)
			return {key:"str", value:str};
		else
			return null;
	}
	
	function getProvinceCondition() {
		var text = $("#sec-city").attr("text");
		return text==null?"":text;
	}
	
		// 加载
	function loadData(paramJson){
		$.ajax({
			type: "post",
			data:paramJson,
			url: "${basePath}/data/platformTable",
			success: function(data, textStatus){
				$(".jiazai").hide();
				$("#tableDiv").empty();
				$("#tableDiv").append(data);
			},
			beforeSend:function(){
				$("#tableDiv").empty();
				$("#tableDiv").append("<div class='jiazai' ><div class='jiazai-tishi'>正在加载中</div> </div>");
			},
			complete:function(){//自定义指标
				selectType();
			}
			});
	}
	
	
</script>
<div id="page-top">
	<jsp:include page="/include/top.jsp"/>
</div>
<!--网贷数据汇总-->
<div class="shuju-nav">网贷数据汇总</div>
<div class="date">
<a id="ssss" ></a>
	<div class="date_top">
		<ul>
			<li class="tab_1"><a class="hovertab" href="javascript:;" >平台数据</a></li>
			<li class="tab_2"><a href="${basePath }/data/industry.html" >行业数据</a></li>
			<li class="tab_3"><a href="javascript:void(0);" onclick="var a = popLogin('${basePath}/data/attention.html');" >我的关注</a></li>
			<li class="tab_4"><a href="${basePath }/data/question.html" >问题平台</a></li>
		</ul>
	</div>

	<!--平台数据--> 
	<div class="dis" id="tbc_02">
		
		<div class="jiansuotiaojian">
			<div class="jiansuotiaojian-left">
				<a href="javascript:;" text="1" class="current">昨天</a> 
				<a href="javascript:;" text="2">最近7日</a> 
				<a href="javascript:;" text="3">最近30日</a>
			</div>       
		 <!--自定日期--> 
        	 <div id="widget" class="zdrq">
				<div id="widgetField">
					<span>自定义日期</span>
					<a href="javascript:void(0)"  ></a>
				</div>
				<div id="widgetCalendar">
				</div>
			</div>          
			<div class="jiansuotiaojian-right"> 
				<!--自定义地区--> 
				<span id="zddq">
					<a href="javascript:void(0)" id="sec-city">自定义地区</a>
					<div class="city">
						<a href="javascript:;" text="">全国</a>
						<a href="javascript:;" text="19">广东</a>
						<a href="javascript:;" text="2">北京</a>
						<a href="javascript:;" text="10">上海</a>
						<a href="javascript:;" text="12">浙江</a>
						<a href="javascript:;" text="11">江苏</a>
						<a href="javascript:;" text="3">山东</a>
						<a href="javascript:;" text="23">四川</a>
						<a href="javascript:;" text="17">湖北</a>
						<a href="javascript:;" text="other">其他</a>
					</div>
				</span>  
				<!--自定义指标--> 
				<span id="zdzb">
					<a href="javascript:void(0)" id="sec-zhibiao">自定义指标</a>
					<div class="zhibiao">
						<ul>
							<li><label for="zhibiao1" class="checkboxed"><input name="zhibiao" id="zhibiao1" type="checkbox" value="2" checked> 成交量</label></li>
							<li><label for="zhibiao2" class="checkboxed"><input name="zhibiao" id="zhibiao2" type="checkbox" value="3" checked> 平均利率</label></li>
							<li><label for="zhibiao3" class="checkboxed"><input name="zhibiao" id="zhibiao3" type="checkbox" value="4" checked> 平均借款期限</label></li>
							<li><label for="zhibiao4" class="checkboxed"><input name="zhibiao" id="zhibiao4" type="checkbox" value="5" checked> 投资人数</label></li>
							<li><label for="zhibiao5" class="checkboxed"><input name="zhibiao" id="zhibiao5" type="checkbox" value="6" checked> 借款人数</label></li>
							<li><label for="zhibiao6"><input name="zhibiao" id="zhibiao6" type="checkbox" value="7" disabled> 人均投资金额</label></li>
							<li><label for="zhibiao7"><input name="zhibiao" id="zhibiao7" type="checkbox" value="8" disabled> 人均借款金额</label></li>
							<li style="width:175px;"><label for="zhibiao8"><input name="zhibiao" id="zhibiao8" type="checkbox" value="9" disabled> 前十大土豪待收金额占比</label></li>
							<li><label for="zhibiao9"><input name="zhibiao" id="zhibiao9" type="checkbox" value="10" disabled> 借款标数</label></li>
							<li><label for="zhibiao10"><input name="zhibiao" id="zhibiao10" type="checkbox" value="11" disabled> 时间加权成交量</label></li>
							<li><label for="zhibiao11"><input name="zhibiao" id="zhibiao11" type="checkbox" value="12" disabled> 满标用时</label></li>
							<li style="width:175px;"><label for="zhibiao12"><input name="zhibiao" id="zhibiao12" type="checkbox" value="13" disabled> 前十大土豪待还金额占比</label></li>
							<li><label for="zhibiao13"><input name="zhibiao" id="zhibiao13" type="checkbox" value="14" disabled> 运营时间</label></li>
							<li><label for="zhibiao14"><input name="zhibiao" id="zhibiao14" type="checkbox" value="15" disabled> 注册资金</label></li>
							<li><label for="zhibiao15"><input name="zhibiao" id="zhibiao15" type="checkbox" value="16" disabled> 资金杠杆</label></li>
							<li><label for="zhibiao16" class="checkboxed"><input name="zhibiao" id="zhibiao16" type="checkbox" value="17" checked> 近30日资金净流入</label></li>
							<li><label for="zhibiao17"><input name="zhibiao" id="zhibiao17" type="checkbox" value="18" disabled> 未来60日待还 </label></li>
							<li><label for="zhibiao18" class="checkboxed"><input name="zhibiao" id="zhibiao18" type="checkbox" value="19" checked> 累计待还金额</label></li>
							<li class="li-btn"><input type="button" value="提交" class="btn" onclick="selectType();"></li>
							<li class="li-tishi">提示：还可	选择 <i> 0</i> 项</li>
						</ul>
					</div>
				 </span>
		    </div>
		</div>
	
		<!--平台数据表格-->
		<div class="form">
			<div class="form_content">
				<dl id="formDl">
					<dt>
						<span class="bt_0"></span>
						<span class="bt_1">名称</span>
						<span class="bt_2"><a href="javascript:;" text="volume" class="visited-1">成交量</a></span><!-- class="visited-1" desc --> 
						<span class="bt_3"><a href="javascript:;" text="compound_interest">平均利率</a></span><!-- class="visited-2" asc --> 
						<span class="bt_99"><a href="javascript:;" text="average_loan_time">平均借款期限</a></span>
						<span class="bt_99"><a href="javascript:;" text="investment_num">投资人数</a></span> 
						<span class="bt_99"><a href="javascript:;" text="borrower_num">借款人数</a></span>
						<span class="bt_99" style="display:none;"><a href="javascript:;" text="av_investment_amount">人均投资金额</a></span>
						<span class="bt_99" style="display:none;"><a href="javascript:;" text="av_borrow_amount">人均借款金额</a></span>
						<span class="bt_99 mytest" style="display:none;"><a href="javascript:;" text="10_collecting">前十大土豪代<br>收金额占比</a></span>
						<span class="bt_99" style="display:none;"><a href="javascript:;" text="borrow_num">借款标数</a></span>
						<span class="bt_99" style="display:none;"><a href="javascript:;" text="time_weighted_volume">时间加权成交量</a></span>
						<span class="bt_99" style="display:none;"><a href="javascript:;" text="full_biaoyong_time">满标用时</a></span>
						<span class="bt_99 mytest" style="display:none;"><a href="javascript:;" text="10_borrowers">前十大借款人<br>代收金额占比</a></span>
						<span class="bt_99" style="display:none;"><a href="javascript:;" text="operating_time">运营时间</a></span>
						<span class="bt_99" style="display:none;"><a href="javascript:;" text="registered_capital">注册资金</a></span>
						<span class="bt_99" style="display:none;"><a href="javascript:;" text="leverage">资金杠杆</a></span>
						<span class="bt_99"><a href="javascript:;" text="30_inflows">近30日净流入</a></span>
						<span class="bt_99" style="display:none;"><a href="javascript:;" text="60_still">未来60日待还</a></span>
						<span class="bt_99"><a href="javascript:;" text="cumulative_amount">累计待还金额</a></span>
						<span class="bt_9 fr">关注</span>
					</dt>					
					<div id="tableDiv">
					<jsp:include page="platformTable.jsp"/>
					
			
		
		
	</div>
</div>

<!--关注层begin-->
<div class="tanchuzhezhao" id="guanzhutanchu" style="display: none">
<div class="zhezhaotoumingbg"></div> 
<div class="guanzhu-tishi" >
   <h2>已关注</h2>
</div>
</div>
<!--关注层end-->
<jsp:include page="/include/footer.jsp"/>
<script type="text/javascript">
	/*行业数据、平台数据滑动门js开始*/
	function g(o){return document.getElementById(o);}
	function HoverLi(n){
		//如果有N个标签,就将i<=N;
		for(var i=1;i<=2;i++){
			g('tb_'+i).className='normaltab';
			g('tbc_0'+i).className='undis';
		}
		g('tbc_0'+n).className='dis';
		g('tb_'+n).className='hovertab';
	}
	//如果要做成点击后再转到请将<li>中的onmouseover 改成 onclic
	/*行业数据、平台数据滑动门js结束*/
	/*时间分布/地区分布切换js开始*/
	function g1(o){return document.getElementById(o);}
	function HoverLiFenbu(n){
		//如果有N个标签,就将i<=N;
		for(var i=1;i<=2;i++){
			g1('fenbu_0'+i).className='undis';
		}
		g1('fenbu_0'+n).className='dis';
	}
	
	//如果要做成点击后再转到请将<li>中的onmouseover 改成 onclic
	/*时间分布/地区分布切换js结束*/
	//自定义地区
	$(document).ready(function() {
		//日期初始化
		var date = new Date();
		date.addDays(-1);  
		var dateStr = date.toDateString("yyyy-MM-dd");
		$("#widgetField").find("span").text(dateStr+"/"+dateStr);
		$('.city').hide();  
		$('#sec-city').click(function(){
			//$('.city').toggle();
			if($('.city').is(':hidden')==true)	{
				$('.city').show();
				$('#zddq').css('background-image','url(${basePath}/images/shuju_14_02.png)');		  
			}else{
				$('.city').hide();	 
				$('#zddq').css('background-image','url(${basePath}/images/shuju_14_01.png)');	 
			}
		  	$('.zhibiao').hide();
		  	$('.city a').click(function(){
				var a=$(this).text();
				$('#sec-city').text(a);
				$('.city').hide(); 
				$('#zddq').css('background-image','url(${basePath}/images/shuju_14_01.png)');
		  	});
	  	});


		//自定义指标
		$('.zhibiao').hide();  
		$('#sec-zhibiao').click(function(){				  
			//$('.zhibiao').toggle();		
			  if($('.zhibiao').is(':hidden')==true)	{
			  $('.zhibiao').show();
			  $('#zdzb').css('background-image','url(${basePath}/images/shuju_14_02.png)');		  
			  }else{
				  $('.zhibiao').hide();	 
				  $('#zdzb').css('background-image','url(${basePath}/images/shuju_14_01.png)');	 
				  }
							 
			  $('.city').hide();
			  $('#zddq').css('background-image','url(${basePath}/images/shuju_14_01.png)');	
			  $('.li-btn').click(function(){					 
				  $('.zhibiao').hide(); 
				  $('#zdzb').css('background-image','url(${basePath}/images/shuju_14_01.png)');	
			  }); 
		});
  
		
	//导航浮动
	$(document).scroll(function(){

		var heigh=$(document).scrollTop();
		if(heigh>668){
			$(".form_content dl dt").css({'position':'fixed','top':'0','left':'50%','margin-left':'-500px','width':'1000px','box-shadow':'0 3px 5px #e2e2e2'});
		}else{
			$(".form_content dl dt").css({'position':'relative','top':'0','left':'0','margin-left':'0','width':'100%'});		 
		}
	});
	
 //日期选择
	//实例一
	$('#date').DatePicker({
		flat: true,
		date: '2012-07-31',
		current: '2012-07-31',
		calendars: 1,
		starts: 1,
		view: 'years'
	});
   
 //实例五
	var now3 = new Date();
	//now3.addDays(-4);
	now3.addDays(-1);//默认选中几天
	var now4 = new Date();
	now4.addDays(-1);
	$('#widgetCalendar').DatePicker({
		flat: true,
		format:'Y-m-d',
		date: [new Date(now3), new Date(now4)],
		calendars: 2,
		mode: 'range',
		starts: 1,
		minDate:new Date(),
		onChange: function(formated) {
			$('#widgetField span').get(0).innerHTML = formated.join('/');
		}
	});
	var state = false;
	$('#widgetField>a').bind('click', function(){
		$('#widgetCalendar').stop().animate({height: state ? 0 : $('#widgetCalendar div.datepicker').get(0).offsetHeight}, 500);
		$('.city').hide();
	  $('.zhibiao').hide();
		state = !state;
		return false;
	});
});
	// 日期选择
	function calenderClick(){
		// 移除昨日，7日，30日
		$('.jiansuotiaojian-left').find("a").removeAttr("class");
		$('#widgetCalendar').height(0);	// 日期收起
		var txt = $("#widgetField").find("span").text();
		if(txt!='自定义日期'){
			var paramJson = {};
			
			var orderByCondition = getOrderByCondition();
			var orderby = orderByCondition.orderby;
			var column = orderByCondition.column;
			paramJson.orderby = orderby;
			paramJson.column = column;
			
			paramJson.timeStr = txt;
			
			paramJson.provinceId = getProvinceCondition();
			loadData(paramJson);
		}
	} 
</script>
